<!DOCTYPE html>
<html style="height:100%" lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
    <link rel="stylesheet" href="/assets/2021-a/map.css">
    <title>
      {applicationName} {applicationVersion} - Webserver
    </title>
  </head>
  <body id="mapPage" onresize="sizeMapToContainer()" style="margin:0;height:100%;display:flex;flex-direction:column">
    <div id="header" class="toolbar">
      <div>
        <form id="refreshform" onsubmit="checkRefresh();return false" name="refreshform">
          <input type="checkbox" onclick="checkRefresh()" id="refreshMapToggle">
          <label for="refreshMapToggle">auto<br>refresh</label>
          <input type="number" value="1" step="1" min="1" onchange="delayRefresh()" id="refreshDelay" style="width:40px;text-align:right" disabled>
          <label>s delay</label>
          <button type="button" onclick="refreshMap()">Now</button>
          <span class="gap"></span>
          <input type="checkbox" onclick="toggleCenterAircraft()" id="refreshWithAircraft">
          <label for="refreshWithAircraft">center<br>is Aircraft</label>
          <button type="button" onclick="centerMapOnAircraft()">Here</button>
        </form>
        <form id="flightplanform" name="flightplanform">
          <button type="button" onclick="submitMapRouteCmd()">fit view to all Waypoints</button>
        </form>
        <form id="airportform" onsubmit="submitMapAirportCmd();return false" name="airportform">
          <span class="gap"></span>
          <input id="airporttext" type="text" placeholder="ICAO" name="airportident" value="" style="width:40px;text-transform:uppercase">
          <button type="button" onclick="submitMapAirportCmd()">center Airport</button>
        </form>
        <form id="optionsform">
          <span class="gap"></span>
          <input type="checkbox" value="true" name="preventstandby" onclick="preventStandby(this)" id="preventstandby">
          <label for="preventstandby">prevent<br>device standby</label>
          <!--span class="formparts" id="retinaOption">
            <input type="checkbox" checked value="true" name="use Retina map" onclick="toggleRetinaMap(this)" id="retinaToggle">
            <label for="retinaToggle">Retina map (bigger download, longer creation duration)</label>
          </span-->
        </form>
        <form id="pluginform">
          <span class="gap"></span>
        </form>
        <iframe src="about:blank" id="preventstandbyVideoContainer" title="cachable standby prevention resource"></iframe>
      </div>
    </div>
    <div id="interactionParent" style="flex:1 0;overflow:hidden">
      <div id="mapcontainer" class="initially" onclick="handleInteraction(event)">
        <img id="map" src="images/littlenavmap.svg" alt="Map" style="width:100%;height:100%;object-fit:contain;display:block">
      </div>
    </div>
    <script>
      parent.MAP_VERSION = 1;
      parent.attemptRun("findPlugins");
    </script>
  </body>
</html>
